<!DOCTYPE html>
<html style="background: #f5f5f5">

<head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>index</title>
    <link rel="stylesheet" href="css/swiper.min.css" />
    <link rel="stylesheet" href="css/base.css" />
</head>

<body style="background: #f5f5f5">
    <!-- header -->
    <header class="pg-header">
        <div class="wid clearfix">
            <a href="index.html" class="logo fl"><img src="./images/logo.png" /></a>
            <div class="fr clearfix">

                <div class="hd-center re-hd-center"> 已有账号，请直接<a href="#login-modal" data-toggle="modal"
                        class="quit-btn">登录</a>
                </div>

            </div>

        </div>

    </header>
    <!-- header-end -->

    <!-- 主体 -->
    <div class="wid user-wrap">
        <div class="user-sec clearfix">
            <div class="register-wrap">

                <div class="r-tabs">
                    <a href="javascript:;" class="active">个人注册</a>
                    <a href="javascript:;">机构注册</a>
                </div>

                <section class="resi-sec">
                    <div class="register-list">
                        <div class="re-item">
                            <header class="re-title">设置账号及密码</header>
                            <div class="re-form">
                                <form action="">
                                    <div class="re-list">
                                        <label>手机号</label>
                                        <div class="input-wrap">
                                            <input type="text" placeholder="请输入手机号" class="input-text" />
                                            <div class="wrong-tip">手机号不能为空！</div>
                                        </div>
                                    </div>
                                    <div class="re-list">
                                        <label>短信验证码</label>
                                        <div class="input-wrap">
                                            <input type="text" placeholder="请输入短信验证码" class="input-text code-text" />
                                            <button type="button" class="feachBtn">获取验证码</button>
                                        </div>
                                    </div>
                                    <div class="re-list">
                                        <label>图形校验码</label>
                                        <div class="input-wrap">
                                            <input type="text" placeholder="请输入图形校验码" class="input-text code-text" />
                                            <div class="tx-code"><img src="./images/codeimg.png" /></div>
                                        </div>
                                    </div>
                                    <div class="re-list">
                                        <label>设置密码</label>
                                        <div class="input-wrap">
                                            <input type="text" placeholder="请输入密码" class="input-text" />

                                        </div>
                                    </div>
                                    <div class="re-list">
                                        <label>确认密码</label>
                                        <div class="input-wrap">
                                            <input type="password" placeholder="请再次输入密码" class="input-text" />

                                        </div>
                                    </div>

                                </form>

                            </div>


                        </div>
                        <div class="re-item">
                            <header class="re-title">填写基本信息</header>
                            <div class="re-form">
                                <form action="">
                                    <div class="re-list">
                                        <label>真实姓名</label>
                                        <div class="input-wrap">
                                            <input type="text" placeholder="请输入真实姓名" class="input-text" />
                                        </div>
                                    </div>
                                    <div class="re-list">
                                        <label>身份证</label>
                                        <div class="input-wrap">
                                            <input type="text" placeholder="请输入身份证号" class="input-text" />
                                        </div>
                                    </div>
                                    <div class="re-list">
                                        <label>证件有效期</label>
                                        <div class="input-wrap layui-input-inline">
                                            <input type="text" placeholder="2020-09-20" class="input-text"
                                                id="cardTime" />
                                        </div>
                                    </div>
                                    <div class="re-list">
                                        <label>电子邮箱</label>
                                        <div class="input-wrap">
                                            <input type="text" placeholder="请输入邮箱" class="input-text" />
                                        </div>
                                    </div>
                                    <div class="re-list">
                                        <button class="ljzc-btn">立即注册</button>
                                    </div>
                                    <div class="re-list">
                                        <div class="agree-tip">
                                            <label><input type="checkbox" class="checkbox-input" />我已阅读并同意</label><a
                                                href="javascript:;" class="agree-btn red"> 《云水泉资产服务平台使用协议》</a>
                                        </div>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                    <div class="register-list">
                        <div class="re-item">
                            <header class="re-title">设置账号及密码</header>
                            <div class="re-form">
                                <form action="">
                                    <div class="re-list">
                                        <label>手机号</label>
                                        <div class="input-wrap">
                                            <input type="text" placeholder="请输入手机号" class="input-text" />
                                            <div class="wrong-tip">手机号不能为空！</div>
                                        </div>
                                    </div>
                                    <div class="re-list">
                                        <label>短信验证码</label>
                                        <div class="input-wrap">
                                            <input type="text" placeholder="请输入短信验证码" class="input-text code-text" />
                                            <button type="button" class="feachBtn">获取验证码</button>
                                        </div>
                                    </div>
                                    <div class="re-list">
                                        <label>图形校验码</label>
                                        <div class="input-wrap">
                                            <input type="text" placeholder="请输入图形校验码" class="input-text code-text" />
                                            <div class="tx-code"><img src="./images/codeimg.png" /></div>
                                        </div>
                                    </div>
                                    <div class="re-list">
                                        <label>设置密码</label>
                                        <div class="input-wrap">
                                            <input type="text" placeholder="请输入密码" class="input-text" />

                                        </div>
                                    </div>
                                    <div class="re-list">
                                        <label>确认密码</label>
                                        <div class="input-wrap">
                                            <input type="password" placeholder="请再次输入密码" class="input-text" />

                                        </div>
                                    </div>

                                </form>

                            </div>


                        </div>
                        <div class="re-item">
                            <header class="re-title">填写基本信息</header>
                            <div class="re-form">
                                <form action="">
                                    <div class="re-list">
                                        <label>类型</label>
                                        <div class="input-wrap">
                                            <div class="input-text leixing typeLx"></div>
                                        </div>
                                    </div>
                                    <div class="re-list">
                                        <label>机构名称</label>
                                        <div class="input-wrap">
                                            <input type="text" placeholder="请输入正确的机构注册全称" class="input-text" />
                                        </div>
                                    </div>
                                    <div class="re-list">
                                        <label>证件类型</label>
                                        <div class="input-wrap">
                                            <div class="input-text leixing certificates"></div>
                                        </div>
                                    </div>
                                    <div class="re-list">
                                        <label>证件号码</label>
                                        <div class="input-wrap layui-input-inline">
                                            <input type="text" placeholder="请输入证件号码" class="input-text" />
                                        </div>
                                    </div>
                                    <div class="re-list">
                                        <label>电子邮箱</label>
                                        <div class="input-wrap">
                                            <input type="text" placeholder="请输入邮箱" class="input-text" />
                                        </div>
                                    </div>
                                    <div class="re-list">
                                        <button class="ljzc-btn">立即注册</button>
                                    </div>
                                    <div class="re-list">
                                        <div class="agree-tip">
                                            <label><input type="checkbox" class="checkbox-input" />我已阅读并同意</label><a
                                                href="javascript:;" class="agree-btn red"> 《云水泉资产服务平台使用协议》</a>
                                        </div>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                </section>

            </div>
        </div>
    </div>
    <!-- 主体-end -->
    <!-- footer -->
    <footer class="pg-footer">
        <div class="wid">
            <div class="ft-left">
                <ul class="ft-nav clearfix">
                    <li>
                        <a href="about.html">关于我们</a>
                    </li>
                    <li>
                        <a href="contact.html">联系方式 </a>
                    </li>
                    <li>
                        <a href="#login-modal" data-toggle="modal" class="logo-btn">客户登录</a>
                    </li>
                    <li>
                        <a href="join.html">校园招聘</a>
                    </li>
                </ul>
                <div class="copyRight">
                    Copyright © 云水泉（北京）资产管理有限公司版权所有 京ICP备10040000053号 京公网安备110102000008

                </div>
            </div>
            <div class="ft-right">
                <ul>
                    <li>
                        <i class="ft-icon icon_weixin"></i>
                        <dl>
                            <img src="./images/weixin.jpg" />
                        </dl>

                    </li>
                    <li>
                            <a href="">
                                    <i class="ft-icon icon_weibo"></i>
                                  </a>
                    </li>
                </ul>

            </div>
        </div>
    </footer>
    <!--footer-end-->
    <!-- login -->
    <div class="modal fade login-modal" id="login-modal">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="close" data-dismiss="modal"><i class="iconfont icon-guanbi"></i></div>
                <div class="login-box">
                    <header class="login-title">客户登录</header>
                    <form action="center.html">
                        <div class="form-list">
                            <input type="text" placeholder="请输入账号/手机号" class="form-text" />
                        </div>
                        <div class="form-list">
                            <input type="password" placeholder="请输入密码" class="form-text" />
                        </div>
                        <div class="form-list">
                            <button class="login-btn">立即登陆</button>
                        </div>
                        <div class="form-list"> <a href="find-password.html" class="find-btn">找回密码</a></div>
                        <div class="form-list"> <a href="register.html" class="register-btn">立即注册</a></div>
                        <div class="form-list">
                            <p class="no-code">还没账号，<a href="register.html">请注册</a></p>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
    <!-- login-end -->

    <!-- 注册协议 -->

    <div class="tzsm-modal hide">
        <div class="tzsm-modal-con">
            <div class="swiper-container">
                <div class="swiper-wrapper">
                    <div class="swiper-slide">
                        <header>
                            注册协议
                        </header>
                        <article>  
                            <p>
                                在继续浏览本公司网站前，敬请您仔细阅读本重要提示，并将页面滚动至本页结尾“接受”或“放弃”键，根据您的具体情况选择继
                                续浏览还是放弃。点击“接受”键，视为您已经阅读并认定自己符合合格投资者条件，且愿意遵守本提示内容。
                            </p> <br>
                            <p>1、合格投资者。根据《中华人民共和国证券投资基金法》、《私募投资基金监督管理暂行办法》及其他相关法律法规的有关规定，私
                                募投资基金的投资者应为具备相应风险识别能力和风险承担能力、投资于公司单只私募基金产品的金额不低于100万元人民币且符合下
                                列相关标准的单位和个人：</p>
                            <p>(一) 净资产不低于1000 万元的单位；</p>
                            <p>(二) 金融资产不低于300 万元或者最近三年个人年均收入不低于50 万元的个人。</p>
                            <br>
                            <p>1、前款所称金融资产包括银行存款、股票、债券、基金份额、资产管理计划、银行理财产品、信托计划、保险产品、期货权益等。
                                投资者应当认真阅读产品法律文件，了解产品的风险收益特征，并根据自身的投资目的、投资期限、投资经验、资产状况等判断产品
                                是否与自身的风险承受能力相适应。</p>
                            <p>2、参与私募投资基金有风险。私募投资基金净值可能会有较大的波动，并可能在短时间內大幅下跌，并造成投资者损失部分或全部
                                投资金额。管理人过往的业绩数据并不预示其未来的表现，投资者不应依赖本网站所提供的数据做出投资决策，并自行承担所作出投
                                资决策之相应风险。</p>
                            <p>1、前款所称金融资产包括银行存款、股票、债券、基金份额、资产管理计划、银行理财产品、信托计划、保险产品、期货权益等。
                                投资者应当认真阅读产品法律文件，了解产品的风险收益特征，并根据自身的投资目的、投资期限、投资经验、资产状况等判断产品
                                是否与自身的风险承受能力相适应。</p>
                            <p>2、参与私募投资基金有风险。私募投资基金净值可能会有较大的波动，并可能在短时间內大幅下跌，并造成投资者损失部分或全部
                                投资金额。管理人过往的业绩数据并不预示其未来的表现，投资者不应依赖本网站所提供的数据做出投资决策，并自行承担所作出投
                                资决策之相应风险。</p>

                        </article>
                    </div>
                </div>
                <!-- Add Scroll Bar -->
                <div class="swiper-scrollbar"></div>
            </div>

            <div class="tzsm-bt">
                <div class="check"><label><input type="checkbox" />我已经仔细阅读了协议</label></div>

                <div class="tzsm-btns">
                    <a href="" class="jj-btn">拒绝</a>
                    <a href="javascript:;" class="js-btn">接受</a>
                </div>

            </div>


        </div>

    </div>

    <!-- 注册协议-end -->

    <script src="js/jquery.min.js"></script>
    <script src="js/swiper.min.js"></script>
    <script src="js/bootstrap.js"></script>
    <script src="js/common.js"></script>
    <script src="laydate/laydate.js"></script>
    <script src="js/SelectBox.min.js"></script>
    <script>
        // 注册
        // 点击获取验证码操作
        $('.feachBtn').click(function () {
            let count = 60;
            const countDown = setInterval(() => {
                if (count === 0) {
                    $(this).text('重新发送').removeAttr('disabled');
                    $(this).css({
                        background: '#ff9400',
                        color: '#fff',
                    });
                    clearInterval(countDown);
                } else {
                    $(this).attr('disabled', true);
                    $(this).css({
                        background: '#d8d8d8',
                        color: '#707070',
                    });
                    $(this).text(count + '秒后可重新获取');
                }
                count--;
            }, 1000);
        });


        lay('#version').html('-v' + laydate.v);


        //执行一个laydate实例
        laydate.render({
            elem: '#cardTime' //指定元素
        });



        // 模拟select
        var lxdata = [{
                    name: '境内机构',
                    id: '1'
                },
                {
                    name: '境内机构2',
                    id: '2'
                },
                {
                    name: '境内机构3',
                    id: '3'
                },
                {
                    name: '境内机构4',
                    id: '4'
                }
            ],
            fnBack = function (result) {
                console.log(result.name + ' ' + result.id);
            };


        new SelectBox($('.typeLx'), lxdata, fnBack, {

            textIndent: "10px", //字体缩进						
            arrowColor: 'green', //箭头颜色
            backgroundColor: '#fff', //背景色颜色
            borderColor: '#d4d4d4', //边线颜色
            hoverColor: '#320f6d', //下拉框HOVER颜色	
            borderWidth: 1, //边线宽度
            arrowBorderWidth: 0, //箭头左侧分割线宽度。如果为0则不显示					
            allowInput: false, //是否允许输入						
            width: 300, //宽
            height: 40, //高
            optionMaxHeight: 500, //下拉框最大高度
            placeholder: '境内机构', //默认提示
        });

        // 证件类型
        var zjdata = [{
                    name: '营业执照',
                    id: '1'
                },
                {
                    name: '营业执照2',
                    id: '2'
                },
                {
                    name: '营业执照3',
                    id: '3'
                },
                {
                    name: '营业执照4',
                    id: '4'
                }
            ],
            fnBack = function (result) {
                console.log(result.name + ' ' + result.id);
            };


        new SelectBox($('.certificates'), zjdata, fnBack, {

            textIndent: "10px", //字体缩进						
            arrowColor: 'green', //箭头颜色
            backgroundColor: '#fff', //背景色颜色
            borderColor: '#d4d4d4', //边线颜色
            hoverColor: '#f8f5f5', //下拉框HOVER颜色	
            borderWidth: 1, //边线宽度
            arrowBorderWidth: 0, //箭头左侧分割线宽度。如果为0则不显示					
            allowInput: false, //是否允许输入						
            width: 440, //宽
            height: 40, //高
            optionMaxHeight: 500, //下拉框最大高度
            placeholder: '境内机构', //默认提示
        });
    </script>

</body>

</html>